<template>
  <el-dropdown>
    <span class="el-dropdown-link">
      <el-avatar
        size="medium"
        src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
      ></el-avatar>
    </span>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item>
        <div class="userinfo">
          <h2 style="text-align:center;color:lightblue">userid</h2>
          <router-link to='/user'><i class="el-icon-s-home"> 个人中心</i></router-link>
          <router-link to='/myquestion'><i class="el-icon-question"> 我的提问</i></router-link>
          <router-link to='/user'><i class="el-icon-tickets"> 我的比赛</i></router-link>
          <router-link to='/team'><i class="el-icon-connection"> 我的团队</i></router-link>
          <router-link to='/'><i
              class="el-icon-switch-button"
              style="cursor: pointer"
              @click="logout"
            > 注销</i></router-link>
        </div>
      </el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>

<script>
export default {
  name: 'UserLogin',
  methods: {
    logout () {
      window.sessionStorage.setItem('token', '')
      this.$message({
        message: '登出成功',
        type: 'success',
        duration: 3000
      })
      setTimeout(window.location.reload(), 2000)
    }
  }
}
</script>

<style>
.userinfo {
  text-align: center;
  width: 100px;
}
i {
  font-size: 16px;
}
</style>
